<template>
<!--  <section class="manage-section">-->
<!--    <section class="section_main">-->
<!--&lt;!&ndash;      <section class="section_main_top">&ndash;&gt;-->
<!--&lt;!&ndash;        <div>&ndash;&gt;-->
<!--&lt;!&ndash;          <el-button size="mini" class="el-bule-button" @click="openDialog('add')">新增</el-button>&ndash;&gt;-->
<!--&lt;!&ndash;          <el-button size="mini" class="el-bule-button" @click="handleArrDelete">批量删除</el-button>&ndash;&gt;-->
<!--&lt;!&ndash;        </div>&ndash;&gt;-->
<!--&lt;!&ndash;      </section>&ndash;&gt;-->
<!--      <section class="section_main_table">-->
<!--        <el-table-->
<!--          :data="tableData"-->
<!--          height="60vh"-->
<!--          v-loading="loading">-->
<!--          <el-table-column type="index" label="序号" width="60" align="center"></el-table-column>-->
<!--          <el-table-column prop="date" label="日期" align="center" width="128"></el-table-column>-->
<!--          <el-table-column prop="wagonNumber" label="车牌号" align="center" width="160"></el-table-column>-->
<!--          <el-table-column prop="garbageSource" label="垃圾来源（区域）" align="center"></el-table-column>-->
<!--          <el-table-column prop="garbageType" label="垃圾种类" align="center"></el-table-column>-->
<!--          <el-table-column prop="garbageNumber" label="数量（kg）" align="center" width="140"></el-table-column>-->
<!--          <el-table-column prop="recordingPerson" label="记录人" align="center" width="120"></el-table-column>-->
<!--          <el-table-column label="操作" width="230" align="center">-->
<!--            <template slot-scope="scope">-->
<!--              <el-button-->
<!--                type="text"-->
<!--                class="textButton"-->
<!--                icon="el-icon-edit-outline"-->
<!--                @click="openDialog('edit',scope.row)"-->
<!--              ></el-button>-->
<!--              <el-button-->
<!--                type="text"-->
<!--                class="textButton"-->
<!--                style="color:red;"-->
<!--                icon="el-icon-delete"-->
<!--                @click="handleDelete(scope.$index, scope.row)"-->
<!--              ></el-button>-->
<!--            </template>-->
<!--          </el-table-column>-->
<!--        </el-table>-->
<!--        <el-pagination-->
<!--          style="margin-top: 10px;float: right"-->
<!--          :page-size="8"-->
<!--          @current-change="reloadPage"-->
<!--          layout="total, prev, pager, next, jumper"-->
<!--          :current-page.sync="currentPage"-->
<!--          :total=total />-->
<!--      </section>-->
<!--    </section>-->
<!--    <edit-dialog-->
<!--      :visible-flag='dialogData.visibleFlag'-->
<!--      :data="dialogData.editData"-->
<!--      @close-dialog="closeDialog"/>-->
<!--  </section>-->
  <section>
    <edit-table
      ref="table"
      :table-column="tableColumn"
      is-index
      :api-path="apiPath">
      <el-table-column slot="operate" label="操作" width="230" align="center">
        <template slot-scope="scope">
          <el-button
            type="text"
            class="textButton"
            icon="el-icon-edit-outline"
            @click="openDialog('edit',scope.row)"
          ></el-button>
          <el-button
            type="text"
            class="textButton"
            style="color:red;"
            icon="el-icon-delete"
            @click="handleDelete(scope.$index, scope.row)"
          ></el-button>
        </template>
      </el-table-column>
    </edit-table>
    <edit-dialog
      :visible-flag='dialogData.visibleFlag'
      :data="dialogData.editData"
      :api-path="apiPath"
      @close-dialog="closeDialog"
      @submitForm="submitForm">
      <edit-form
        slot="dialog-section"
        :data="dialogData.editData"/>
    </edit-dialog>
  </section>
</template>

<script>
import request from '@/network/request'
// import editDialog from './editDialog'
import editTable from '@/components/editTable'
import editDialog from '@/components/editDialog'
import editForm from './editForm'
import { tableColumn, apiPath } from './data.enum.js'
export default {
  components: {
    // editDialog
    editTable,
    editDialog,
    editForm
  },
  beforeMount () {
    // this.getData()
    this.tableColumn = tableColumn
  },
  data () {
    return {
      apiPath: apiPath,
      dialogData: {
        visibleFlag: false,
        dialogTitle: '新增',
        formType: 'add',
        editData: {}
      }
      // selectionArr: [],
      // tableData: [],
      // tableColumn: [],
      // loading: false,
      // pageSize: 8,
      // currentPage: 1,
      // total: 0
    }
  },
  methods: {
    // getData () {
    //   this.loading = true
    //   request({
    //     method: 'post',
    //     url: '/shlj/abnormolGarbage/select',
    //     params: {
    //       pageSize: this.pageSize,
    //       currentPage: this.currentPage
    //     }
    //   }).then((res) => {
    //     console.log(res.data.data.records)
    //     this.tableData = res.data.data.records
    //     this.total = res.data.data.sum
    //     this.loading = false
    //   })
    // },
    openDialog (formType, editData = {}) {
      this.dialogData = {
        visibleFlag: true,
        formType,
        editData,
        dialogTitle: formType === 'add' ? '新增' : '编辑'
      }
    },
    handleDelete (index, row) {
      // this.$confirm('此操作将删除该记录, 是否继续?', '提示', {
      //   confirmButtonText: '确定',
      //   cancelButtonText: '取消',
      //   type: 'warning'
      // }).then(() => {
      //   this.deleteRequest(row)
      // }).catch(() => {
      //   this.$message({
      //     type: 'info',
      //     message: '已取消删除'
      //   })
      // })
      this.$refs.table.handleDelete(index, row)
    },
    // handleArrDelete () {
    //   if (this.selectionArr.length === 0) {
    //     this.$alert('请选择要删除的记录', '提醒', {
    //       confirmButtonText: '确定'
    //     })
    //   } else {
    //     this.$confirm('此操作将删除该记录, 是否继续?', '提示', {
    //       confirmButtonText: '确定',
    //       cancelButtonText: '取消',
    //       type: 'warning'
    //     }).then(() => {
    //       for (let i = 0; i < this.selectionArr.length; i++) {
    //         this.deleteRequest(this.selectionArr[i])
    //       }
    //     }).catch(() => {
    //       this.$message({
    //         type: 'info',
    //         message: '已取消删除'
    //       })
    //     })
    //   }
    // },
    // deleteRequest (record) {
    //   console.log(record)
    //   request({
    //     method: 'post',
    //     url: '/shlj/abnormolGarbage/delete',
    //     params: {
    //       id: record.id
    //     }
    //   }).then((res) => {
    //     if (res.data.code === 200) {
    //       this.$message({
    //         type: 'success',
    //         message: '删除成功!'
    //       })
    //       this.getData()
    //     } else {
    //       this.$message.error('删除失败!')
    //     }
    //   })
    // },
    // reloadPage (currentPage) {
    //   this.currentPage = currentPage
    //   this.getData()
    // },
    closeDialog () {
      this.$refs.table.getData()
      this.dialogData.visibleFlag = false
      // this.getData()
    },
    submitForm () {
      const data = this.dialogData.editData
      const params = {
        id: data.id,
        wagon_number: data.wagonNumber,
        garbage_source: data.garbageSource,
        garbage_type: data.garbageType,
        garbage_number: data.garbageNumber,
        recording_person: data.recordingPerson,
        factory: this.$store.getters.getFactory
      }
      if (data.remarks !== null) {
        params.remarks = data.remarks
      } else {
        params.remarks = ''
      }
      request({
        method: 'post',
        url: this.apiPath + '/update',
        params: params
      }).then((res) => {
        if (res.data.code === 200 && res.data.message === 'SUCCESS') {
          this.$message({
            type: 'success',
            message: '保存成功!'
          })
        } else if (res.data.message !== 'SUCCESS') {
          this.$message.error(res.data.message)
        } else if (res.data.code === 400) {
          this.$message.error(res.message)
        } else {
          this.$message.error('保存失败!')
        }
        this.closeDialog()
      })
    }
  }
}
</script>

<style scoped>
</style>
